<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Caprice</title>
<link rel="shortcut icon" type="image/x-icon" href="style/images/favicon.png" />
<link rel="stylesheet" type="text/css" href="style.css" media="all" />
<link href='http://fonts.googleapis.com/css?family=Amaranth' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Droid+Serif:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="style/css/ie7.css" media="all" />
<![endif]-->
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="style/css/ie8.css" media="all" />
<![endif]-->
<!--[if IE 9]>
<link rel="stylesheet" type="text/css" href="style/css/ie9.css" media="all" />
<![endif]-->
<script type="text/javascript" src="style/js/jquery-1.6.4.min.js"></script>
<script type="text/javascript" src="style/js/ddsmoothmenu.js"></script>
<script type="text/javascript" src="style/js/jquery.jcarousel.js"></script>
<script type="text/javascript" src="style/js/jquery.prettyPhoto.js"></script>
<script type="text/javascript" src="style/js/carousel.js"></script>
<script type="text/javascript" src="style/js/jquery.flexslider-min.js"></script>
<script type="text/javascript" src="style/js/jquery.masonry.min.js"></script>
<script type="text/javascript" src="style/js/jquery.slickforms.js"></script>
</head>
<body>
<!-- Begin Wrapper -->
<div id="wrapper">
	<!-- Begin Sidebar -->
	<div id="sidebar">
		 <div id="logo"><a href="index.html"><img src="style/images/logo.png" alt="Caprice" /></a></div>
		 
	<!-- Begin Menu -->
    <div id="menu" class="menu-v">
      <ul>
        <li><a href="index.html" class="active">Home</a>
        	<ul>
        		<li><a href="index.html">Home w/ Carousel</a></li>
        		<li><a href="index2.html">Home w/ Portfolio</a></li>
        		<li><a href="index3.html">Home w/ Testimonials</a></li>
        	</ul>
        </li>
        <li><a href="portfolio.html">Portfolio</a>
        	<ul>
        		<li><a href="portfolio.html">Portfolio 4 Columns</a></li>
        		<li><a href="portfolio2.html">Portfolio 3 Columns</a></li>
        		<li><a href="portfolio3.html">Portfolio 2 Columns</a></li>
        		<li><a href="portfolio4.html">Portfolio 1 Column</a></li>
        		<li><a href="portfolio-post.html">Portfolio Post</a></li>
        	</ul>
        </li>
        <li><a href="blog.html">Blog</a>
        	<ul>
        		<li><a href="blog.html">Blog</a></li>
        		<li><a href="blog2.html">Blog w/ Sidebar</a></li>
        		<li><a href="post.html">Post</a></li>
        		<li><a href="post2.html">Post w/ Sidebar</a></li>
        	</ul>
        </li>
        <li><a href="buttons-boxes-images.html">Features</a>
        	<ul>
        		<li><a href="buttons-boxes-images.html">Buttons Boxes Images</a></li>
        		<li><a href="tabs-toggle-table.html">Tabs Toggle Tables</a></li>
        		<li><a href="testimonials.html">Testimonials</a></li>
        		<li><a href="typography.html">Typography</a></li>
        		<li><a href="service-icons.html">Service Icons</a></li>
        	</ul>
        </li>
        <li><a href="contact.html">Contact Us</a></li>
      </ul>
    </div>
    <!-- End Menu -->
   
    
    <div class="sidebox">
    <ul class="share">
    	<li><a href="#"><img src="style/images/icon-rss.png" alt="RSS" /></a></li>
    	<li><a href="#"><img src="style/images/icon-facebook.png" alt="Facebook" /></a></li>
    	<li><a href="#"><img src="style/images/icon-twitter.png" alt="Twitter" /></a></li>
    	<li><a href="#"><img src="style/images/icon-dribbble.png" alt="Dribbble" /></a></li>
    	<li><a href="#"><img src="style/images/icon-linkedin.png" alt="LinkedIn" /></a></li>
    </ul>
    </div>

    
	</div>
	<!-- End Sidebar -->
	
	<!-- Begin Content -->
	<div id="content">
	<h1 class="title">Portfolio</h1>
	<div class="line"></div>
	<div class="intro">Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</div>
	
	
    
    
    <h3>Ipsum Tortor Vestibulum Sollicitudin</h3>
    
	<!-- Begin Slider -->
	<div id="slider">

		<div class="flexslider">
	    <ul class="slides">
	    	<li><img src="style/images/art/slide1.jpg" alt=""/></li>
	    	<li><img src="style/images/art/slide2.jpg" alt=""/></li>
	    	<li><img src="style/images/art/slide3.jpg" alt=""/></li>
	    	<li><img src="style/images/art/slide4.jpg" alt=""/></li>
	    </ul>
	  </div>

	</div>
    <!-- End Slider --> 

    <blockquote><p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Etiam porta sem malesuada magna mollis euismod.</p></blockquote>
    <p>Donec id elit non mi porta gravida at eget metus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Maecenas sed diam eget risus varius blandit sit amet non magna. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Cras mattis consectetur purus sit amet fermentum.</p>
    
    <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vestibulum id ligula porta felis euismod semper. Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean lacinia bibendum nulla sed consectetur. Sed posuere consectetur est at lobortis.</p>
    
    <div class="line"></div>
    
    <!-- Begin Latest Works -->
    <h2>Related Works</h2>
    <div class="carousel">
      <div id="carousel-scroll"><a href="#" id="prev"></a><a href="#" id="next"></a></div>
      <ul>
        <li> <a href="#"> <span class="overlay details"></span><img src="style/images/art/p1.jpg" alt="" /> </a> </li>
        <li> <a href="#"> <span class="overlay details"></span><img src="style/images/art/p2.jpg" alt="" /> </a> </li>
        <li> <a href="#"> <span class="overlay details"></span><img src="style/images/art/p3.jpg" alt="" /> </a> </li>
        <li> <a href="#"> <span class="overlay details"></span><img src="style/images/art/p4.jpg" alt="" /> </a> </li>
        <li> <a href="#"> <span class="overlay details"></span><img src="style/images/art/p5.jpg" alt="" /> </a> </li>
        <li> <a href="#"> <span class="overlay details"></span><img src="style/images/art/p6.jpg" alt="" /> </a> </li>
        <li> <a href="#"> <span class="overlay details"></span><img src="style/images/art/p7.jpg" alt="" /> </a> </li>
        <li> <a href="#"> <span class="overlay details"></span><img src="style/images/art/p8.jpg" alt="" /> </a> </li>
        <li> <a href="#"> <span class="overlay details"></span><img src="style/images/art/p9.jpg" alt="" /> </a> </li>
        <li> <a href="#"> <span class="overlay details"></span><img src="style/images/art/p10.jpg" alt="" /> </a> </li>
        <li> <a href="#"> <span class="overlay details"></span><img src="style/images/art/p11.jpg" alt="" /> </a> </li>
        <li> <a href="#"> <span class="overlay details"></span><img src="style/images/art/p12.jpg" alt="" /> </a> </li>
      </ul>
    </div>
    <!-- End Latest Works -->
    
    <div class="line"></div>
    
    <h3>Malesuada Condimentum Inceptos Vehicula</h3>
    <p>Sed posuere consectetur est at lobortis. Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.</p>
  
    
   
    
    <!-- Begin Footer -->
    <div id="footer">
  	<div class="footer-box one-third">
  	<h3>Popular Posts</h3>
			<ul class="popular-posts">
				<li>
					<a href="#"><img src="style/images/art/s1.jpg" alt="" /></a>
					<h5><a href="#">Dolor Commodo Consectetur</a></h5>
					<span>26 Aug 2013 | <a href="#">21 Comments</a></span>
				</li>
				
				<li>
					<a href="#"><img src="style/images/art/s2.jpg" alt="" /></a>
					<h5><a href="#">Dolor Commodo Consectetur</a></h5>
					<span>26 Aug 2013 | <a href="#">21 Comments</a></span>
				</li>
				
				<li>
					<a href="#"><img src="style/images/art/s3.jpg" alt="" /></a>
					<h5><a href="#">Dolor Commodo Consectetur</a></h5>
					<span>26 Aug 2013 | <a href="#">21 Comments</a></span>
				</li>

			</ul>
  	</div>
  	<div class="footer-box one-third">
  	<h3>About</h3>
  	<p>Donec id elit non mi porta gravida at eget metus. Donec ullamcorper nulla non metus auctor fringilla.</p> 
  	<p>Lorem Ipsum Dolor Sit
          Moon Avenue No:11/21
          Planet City, Earth<br>
          <br>
          <span class="lite1">Fax:</span> +555 797 534 01<br>
          <span class="lite1">Tel:</span> +555 636 646 62<br>
          <span class="lite1">E-mail:</span> name@domain.com</p>
          
          
  	</div>
  	
  	<div class="footer-box one-third last">
  	<h3>Custom Text</h3>
  	<p>Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas faucibus mollis interdum. Etiam porta sem malesuada magna mollis euismod. Nulla vitae elit. </p>
  	<p>Donec ullamcorper nulla non metus auctor fringilla. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor.</p>
  	</div>
    </div>
    <!-- End Footer -->
    
    
	</div>
	<!-- End Content -->
	
</div>
<!-- End Wrapper -->
<div class="clear"></div>
<script type="text/javascript" src="style/js/scripts.js"></script>
<!--[if !IE]> -->
<script type="text/javascript" src="style/js/jquery.corner.js"></script>
<!-- <![endif]-->
<div style="display:none"><script src='http://v7.cnzz.com/stat.php?id=155540&web_id=155540' language='JavaScript' charset='gb2312'></script></div>
</body>
</html>